import React from "react";
import {ProColumns, ProTable} from "@ant-design/pro-components";

const PipelineRuns: React.FC = () => {

  const columns: ProColumns<Record<string, any>, "text">[] = [
    {
      title: 'ID',
      dataIndex: 'id',
      render: (dom, entity, index, action, schema) => {
        return <a>{entity.id}</a>
      }
    },
    {
      title: '阶段',
      dataIndex: 'stage'
    },
    {
      title: '创建时间',
      dataIndex: 'createTime'
    },
    {
      title: '耗时',
      dataIndex: 'duration'
    },
    {
      title: '结果',
      dataIndex: 'result',
      render: (dom, entity, index, action, schema) => {
        return <span style={{color: entity.result === '成功' ? 'green' : 'red'}}>{entity.result}</span>
      }
    },
    {
      title: '触发人',
      dataIndex: 'triggerBy'
    },
  ]; // 列配置

  const dataSource = [
    {
      id: '#1',
      stage: '构建',
      createTime: '2022-01-01 12:00:00',
      duration: '10m',
      result: '成功',
      triggerBy: '用户A'
    },
    {
      id: '#2',
      stage: '测试',
      createTime: '2022-01-01 12:00:00',
      duration: '20m',
      result: '失败',
      triggerBy: '用户B'
    },
    {
      id: '#3',
      stage: '部署',
      createTime: '2022-01-01 12:00:00',
      duration: '30m',
      result: '成功',
      triggerBy: '用户C'
    }
  ]

  return (
    <div>
      <ProTable columns={columns}
                search={false}
                toolBarRender={false}
                dataSource={dataSource}
      />
    </div>
  )
}
export default PipelineRuns;
